var code = `<html lang="zh"><head><script type="text/javascript" src="chrome-extension://nhpjggchkhnlbgdfcbgpdpkifemomkpg/pageScripts/main.js"></script>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>项目汇报</title>
    <link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;700&amp;display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.4.0/css/all.min.css">
    <style>
        body, html {
            margin: 0;
            padding: 0;
            font-family: 'Noto Sans SC', sans-serif;
        }
        .slide {
            width: 1280px;
            min-height: 720px;
            overflow: hidden;
            background: linear-gradient(135deg, #f0f8ff 0%, #e6f0ff 50%, #d9e8ff 100%);
            position: relative;
        }
        .content-wrapper {
            height: 100%;
            display: flex;
            flex-direction: column;
            justify-content: center;
            z-index: 10;
            position: relative;
        }
        .title {
            font-size: 4rem;
            font-weight: 700;
            color: #0047AB;
            opacity: 0;
            transform: translateY(30px);
            animation: fadeInUp 1s ease forwards 0.3s;
        }
        .subtitle {
            color: #1E3A8A;
            opacity: 0;
            transform: translateY(20px);
            animation: fadeInUp 1s ease forwards 0.6s;
        }
        .presenter-info {
            margin-top: 3rem;
            opacity: 0;
            transform: translateY(20px);
            animation: fadeInUp 1s ease forwards 0.9s;
        }
        .date-info {
            opacity: 0;
            animation: fadeIn 1s ease forwards 1.2s;
        }
        .circle-decoration {
            position: absolute;
            border-radius: 50%;
            background: rgba(59, 130, 246, 0.1);
            z-index: 1;
        }
        @keyframes fadeInUp {
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }
        @keyframes fadeIn {
            to {
                opacity: 1;
            }
        }
    </style>
<style>
    .genspark-badge-button {
      position: fixed;
      bottom: 20px;
      right: 20px;
      background-color: #333;
      color: white;
      border: none;
      border-radius: 4px;
      padding: 8px 12px;
      font-size: 12px;
      cursor: pointer;
      z-index: 9999;
      display: flex;
      align-items: center;
      gap: 6px;
    }
    
    .genspark-modal {
      display: none;
      position: fixed;
      bottom: 80px;
      right: 20px;
      z-index: 10000;
      justify-content: end;
    }
    
    .genspark-modal-content {
      background-color: white;
      border-radius: 8px;
      max-width: 450px;
      width: 100%;
      box-sizing: border-box;
      padding: 20px;
      position: relative;
      box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
      font-size: 14px;
    }
    @media (max-width: 768px) {
      .genspark-modal-content {
        max-width: 90%;
      }
    }
    
    .genspark-close {
      position: absolute;
      top: 10px;
      right: 10px;
      font-size: 20px;
      cursor: pointer;
      background: none;
      border: none;
    }
    
    .genspark-title {
      margin-bottom: 8px;
      font-weight: normal;
      display: inline;
      font-size: 14px;
    }
    
    .genspark-report {
      color: #909499;
      text-decoration: underline;
      cursor: pointer;
      margin-bottom: 14px;
      display: inline;
    }
    
    .genspark-info {
      margin: 25px 0;
      color: #333;
      font-size: 14px;
    }
    
    .genspark-buttons {
      display: flex;
      gap: 10px;
    }
    
    .genspark-remove-btn {
      background-color: #f5f5f5;
      border: 1px solid #ddd;
      color: #333;
      padding: 4px 14px;
      border-radius: 8px;
      cursor: pointer;
      flex: 1;
      font-size: 14px;
      box-sizing: border-box;
    }
    
    .genspark-go-btn {
      background-color: #222;
      border: none;
      color: white;
      padding: 4px 14px;
      border-radius: 8px;
      cursor: pointer;
      flex: 1;
      font-size: 14px;
      box-sizing: border-box;
    }
  </style><script src="https://html2canvas.hertzen.com/dist/html2canvas.min.js"></script><script src="https://html2canvas.hertzen.com/dist/html2canvas.min.js"></script></head>
<body>
    <div class="slide flex justify-center items-center">
        <!-- 装饰性圆形背景 -->
        <div class="circle-decoration" style="width: 500px; height: 500px; top: -250px; right: -150px;"></div>
        <div class="circle-decoration" style="width: 300px; height: 300px; bottom: -100px; left: -100px;"></div>
        <div class="circle-decoration" style="width: 150px; height: 150px; top: 100px; left: 150px;"></div>

        <!-- 内容区域 -->
        <div class="content-wrapper w-4/5 text-center">
            <div class="mb-4">
                <h1 class="title mb-4">项目汇报</h1>
                <h2 class="subtitle text-xl font-medium">PROJECT REPORT</h2>
            </div>
            
            <div class="presenter-info">
                <div class="flex justify-center items-center space-x-6 mb-6">
                    <div class="px-8 py-4 bg-white bg-opacity-70 rounded-lg shadow-md">
                        <p class="text-lg text-gray-700"><i class="fas fa-user mr-2"></i> 汇报人：项目负责人</p>
                    </div>
                    <div class="px-8 py-4 bg-white bg-opacity-70 rounded-lg shadow-md">
                        <p class="text-lg text-gray-700"><i class="fas fa-building mr-2"></i> 部门：研发中心</p>
                    </div>
                </div>
            </div>
            
            <div class="date-info mt-16">
                <p class="text-blue-800 text-lg"><i class="far fa-calendar-alt mr-2"></i> 2023年12月</p>
            </div>
        </div>
    </div>

<script src="https://www.genspark.ai/slide-inner.js?_v=1"></script>
    <script id="html_badge_script1">
        window.__genspark_remove_badge_link = "https://www.genspark.ai/api/html_badge/" +
            "remove_badge?token=To%2FBnjzloZ3UfQdcSaYfDmhsuLz6QLCpzw7ZLCUQt6DV2kUMzMW77OsTYy5TX2t0n2BTlXXsICt2hI4uD18uohFFW6b%2FRjoMTPaBhHL%2BmgN5Bi3ROeKM%2FHXWlGaot2yucE2NCWFEgk8X7%2BR5QaGovz%2FT%2BDDv6CbTJzXzY%2FUbqOswR2dvLSKNNHg1%2Fkj7TWm5uHbJr8GKkoG%2BtVw43J8kARfV2QbuiDroe79B2GdYmU8raZReTnRnjRW9dC3fwfa6paXjxztYxn4QbGivCef8GBVg5QR05%2BiNcR1hn07RgGUalUUfea2Syt1l3nXS%2FyQOzJIpaHhjdwZYuFiTGbsxGW%2BVocWSshuDlKuuE4%2BA3n7IQr%2BE2FLURXZutcUyy4vPABOjppj5nX8q0nKyQdYmNuUI88jVUy6GqrckJfgG3PNfb5o87TTfQybeXdZgotHzp%2FfFC0%2FEhvAbNwVXcW4XxTwKoUEUEm4fipf%2BZBtdfi6uuNKrFXSKY%2BInr8hL8cNZ%2F6wK%2Bxnh2B7k2%2F0W26hXNhC2HjpWUAelxAc%2BujMJJsEqIPAmiUDaJIkmeBkMCRce7MY0eWk00rcp3rJ3zNluJ4CbYAhroxdUYb3RePNRmxMsPutNTMNUkezE%2BApXvBczqirEW1kv%2FYvfPFKCwkAIY2h6hVzpxuHALkdj8g7%2BV4fGT8ho5azfPOAUiXFCFiX7EdTBkxircbpy3KWsVaoDrw%3D%3D";
        window.__genspark_locale = "zh-CN";
        window.__genspark_token = "To/BnjzloZ3UfQdcSaYfDmhsuLz6QLCpzw7ZLCUQt6DV2kUMzMW77OsTYy5TX2t0n2BTlXXsICt2hI4uD18uohFFW6b/RjoMTPaBhHL+mgN5Bi3ROeKM/HXWlGaot2yucE2NCWFEgk8X7+R5QaGovz/T+DDv6CbTJzXzY/UbqOswR2dvLSKNNHg1/kj7TWm5uHbJr8GKkoG+tVw43J8kARfV2QbuiDroe79B2GdYmU8raZReTnRnjRW9dC3fwfa6paXjxztYxn4QbGivCef8GBVg5QR05+iNcR1hn07RgGUalUUfea2Syt1l3nXS/yQOzJIpaHhjdwZYuFiTGbsxGW+VocWSshuDlKuuE4+A3n7IQr+E2FLURXZutcUyy4vPABOjppj5nX8q0nKyQdYmNuUI88jVUy6GqrckJfgG3PNfb5o87TTfQybeXdZgotHzp/fFC0/EhvAbNwVXcW4XxTwKoUEUEm4fipf+ZBtdfi6uuNKrFXSKY+Inr8hL8cNZ/6wK+xnh2B7k2/0W26hXNhC2HjpWUAelxAc+ujMJJsEqIPAmiUDaJIkmeBkMCRce7MY0eWk00rcp3rJ3zNluJ4CbYAhroxdUYb3RePNRmxMsPutNTMNUkezE+ApXvBczqirEW1kv/YvfPFKCwkAIY2h6hVzpxuHALkdj8g7+V4fGT8ho5azfPOAUiXFCFiX7EdTBkxircbpy3KWsVaoDrw==";
    </script>
    
        <script id="html_badge_script2" src="https://www.genspark.ai/html_badge.js"></script>
        </body></html>
`;


var md = `从北京到旅顺，一般情况下，你可以选择以下几种交通方式和具体列车：

### 1. **高铁**
- 从北京乘坐高铁到大连。
- 具体车次：  
  - G201次: 北京南 - 大连北
  - G61次: 北京南 - 大连北
  - G357次: 北京南 - 大连北  
- 到达大连后，可换乘地铁或汽车前往旅顺。

### 2. **火车**
- 从北京到大连有普速火车可以选择，虽然时间较长。
- 具体车次：
  - T68次: 北京西 - 大连
  - K256次: 北京西 - 大连  
- 同样到达大连后，可以转乘地铁或汽车前往旅顺。

### 3. **大巴**
- 你也可以选择从北京乘坐长途客车到大连，再转车前往旅顺。

### 转车建议
1. **从大连到旅顺**：可以乘坐地铁2号线到老虎滩站，再换乘旅顺的公交车或者出租车。
2. 也可以选择直接乘坐长途巴士，车程大约1小时。

你可以通过12306官网或相关的旅游网站提前查询并购票，以确保乘坐时的顺利。希望你有一个愉快的旅程！`

var code2 =`<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>进展情况</title>
    <link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.4.0/css/all.min.css">
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
    <style>
        body, html {
            margin: 0;
            padding: 0;
            font-family: 'Noto Sans SC', sans-serif;
        }
        .slide {
            width: 1280px;
            min-height: 720px;
            overflow: hidden;
            background: linear-gradient(135deg, #f0f8ff 0%, #e6f0ff 50%, #d9e8ff 100%);
            position: relative;
        }
        .slide-title {
            padding-bottom: 8px;
            border-bottom: 3px solid #0047AB;
            display: inline-block;
            color: #0047AB;
            opacity: 0;
            transform: translateY(20px);
            animation: fadeInUp 0.8s ease forwards;
        }
        .content-card {
            background: rgba(255, 255, 255, 0.85);
            border-left: 5px solid #0047AB;
            border-radius: 8px;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
            opacity: 0;
            transform: translateX(-20px);
            animation: fadeInRight 0.8s ease forwards;
        }
        .section-icon {
            background: #0047AB;
            color: white;
            width: 50px;
            height: 50px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
        }
        .circle-decoration {
            position: absolute;
            border-radius: 50%;
            background: rgba(59, 130, 246, 0.1);
            z-index: 1;
        }
        .milestone {
            opacity: 0;
            animation: fadeIn 0.5s ease forwards;
        }
        .timeline-dot {
            width: 20px;
            height: 20px;
            border-radius: 50%;
            background-color: #0047AB;
            z-index: 2;
        }
        .timeline-line {
            position: absolute;
            width: 3px;
            background-color: #0047AB;
            top: 0;
            bottom: 0;
            left: 9px;
            z-index: 1;
        }
        .timeline-item {
            position: relative;
            padding-left: 40px;
            margin-bottom: 20px;
        }
        .timeline-dot-container {
            position: absolute;
            left: 0;
            top: 0;
        }
        .achievement-card {
            transform: translateY(20px);
            opacity: 0;
            animation: fadeInUp 0.8s ease forwards;
        }
        @keyframes fadeInUp {
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }
        @keyframes fadeInRight {
            to {
                opacity: 1;
                transform: translateX(0);
            }
        }
        @keyframes fadeIn {
            to {
                opacity: 1;
            }
        }
    </style>
</head>
<body>
    <div class="slide flex flex-col p-12">
        <!-- 装饰性圆形背景 -->
        <div class="circle-decoration" style="width: 400px; height: 400px; top: -200px; right: -100px;"></div>
        <div class="circle-decoration" style="width: 250px; height: 250px; bottom: -100px; left: -100px;"></div>
        
        <!-- 标题区域 -->
        <div class="mb-8">
            <h1 class="slide-title text-3xl font-bold">进展情况</h1>
        </div>
        
        <!-- 内容区域 -->
        <div class="flex-1 z-10 grid grid-cols-5 gap-6">
            <!-- 左侧 - 时间线和里程碑 -->
            <div class="col-span-3">
                <div class="content-card p-6 h-full" style="animation-delay: 0.2s;">
                    <div class="flex items-start">
                        <div class="section-icon mr-5 flex-shrink-0">
                            <i class="fas fa-tasks text-xl"></i>
                        </div>
                        <div>
                            <h2 class="text-xl font-bold text-blue-900 mb-5">项目里程碑</h2>
                            
                            <div class="relative pl-5">
                                <div class="timeline-line"></div>
                                
                                <!-- 里程碑1 -->
                                <div class="timeline-item milestone" style="animation-delay: 0.5s;">
                                    <div class="timeline-dot-container">
                                        <div class="timeline-dot"></div>
                                    </div>
                                    <div class="bg-blue-100 rounded-lg p-3">
                                        <div class="flex justify-between items-center">
                                            <h3 class="font-bold text-blue-800">需求分析完成</h3>
                                            <span class="bg-green-500 text-white px-2 py-1 rounded text-xs">已完成</span>
                                        </div>
                                        <p class="text-sm text-gray-600 mt-1">2023年9月 | 确定核心功能及用户需求</p>
                                    </div>
                                </div>
                                
                                <!-- 里程碑2 -->
                                <div class="timeline-item milestone" style="animation-delay: 0.7s;">
                                    <div class="timeline-dot-container">
                                        <div class="timeline-dot"></div>
                                    </div>
                                    <div class="bg-blue-100 rounded-lg p-3">
                                        <div class="flex justify-between items-center">
                                            <h3 class="font-bold text-blue-800">产品原型设计</h3>
                                            <span class="bg-green-500 text-white px-2 py-1 rounded text-xs">已完成</span>
                                        </div>
                                        <p class="text-sm text-gray-600 mt-1">2023年10月 | UI/UX设计和交互原型</p>
                                    </div>
                                </div>
                                
                                <!-- 里程碑3 -->
                                <div class="timeline-item milestone" style="animation-delay: 0.9s;">
                                    <div class="timeline-dot-container">
                                        <div class="timeline-dot"></div>
                                    </div>
                                    <div class="bg-blue-100 rounded-lg p-3">
                                        <div class="flex justify-between items-center">
                                            <h3 class="font-bold text-blue-800">第一阶段开发</h3>
                                            <span class="bg-green-500 text-white px-2 py-1 rounded text-xs">已完成</span>
                                        </div>
                                        <p class="text-sm text-gray-600 mt-1">2023年11月 | 核心功能实现</p>
                                    </div>
                                </div>
                                
                                <!-- 里程碑4 -->
                                <div class="timeline-item milestone" style="animation-delay: 1.1s;">
                                    <div class="timeline-dot-container">
                                        <div class="timeline-dot bg-yellow-500"></div>
                                    </div>
                                    <div class="bg-yellow-50 border border-yellow-200 rounded-lg p-3">
                                        <div class="flex justify-between items-center">
                                            <h3 class="font-bold text-yellow-800">内部测试与优化</h3>
                                            <span class="bg-yellow-500 text-white px-2 py-1 rounded text-xs">进行中</span>
                                        </div>
                                        <p class="text-sm text-gray-600 mt-1">2023年12月 | 测试与问题修复</p>
                                    </div>
                                </div>
                                
                                <!-- 里程碑5 -->
                                <div class="timeline-item milestone" style="animation-delay: 1.3s;">
                                    <div class="timeline-dot-container">
                                        <div class="timeline-dot bg-gray-300"></div>
                                    </div>
                                    <div class="bg-gray-100 rounded-lg p-3">
                                        <div class="flex justify-between items-center">
                                            <h3 class="font-bold text-gray-500">正式上线</h3>
                                            <span class="bg-gray-500 text-white px-2 py-1 rounded text-xs">计划中</span>
                                        </div>
                                        <p class="text-sm text-gray-500 mt-1">2024年1月 | 全面部署与市场推广</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            
            <!-- 右侧 - 完成进度和关键成果 -->
            <div class="col-span-2 flex flex-col space-y-6">
                <!-- 完成进度 -->
                <div class="content-card p-6" style="animation-delay: 0.4s;">
                    <div class="flex items-start">
                        <div class="section-icon mr-5 flex-shrink-0">
                            <i class="fas fa-chart-pie text-xl"></i>
                        </div>
                        <div class="w-full">
                            <h2 class="text-xl font-bold text-blue-900 mb-3">项目完成度</h2>
                            <div class="relative" style="height: 180px;">
                                <canvas id="completionChart"></canvas>
                            </div>
                        </div>
                    </div>
                </div>
                
                <!-- 关键成果 -->
                <div class="content-card p-6 flex-1" style="animation-delay: 0.6s;">
                    <div class="flex items-start">
                        <div class="section-icon mr-5 flex-shrink-0">
                            <i class="fas fa-trophy text-xl"></i>
                        </div>
                        <div>
                            <h2 class="text-xl font-bold text-blue-900 mb-3">关键成果</h2>
                            
                            <div class="grid grid-cols-2 gap-3">
                                <div class="achievement-card bg-white p-3 rounded-lg shadow-sm border-t-2 border-blue-500" style="animation-delay: 1.0s;">
                                    <div class="text-blue-500 text-center mb-2">
                                        <i class="fas fa-users text-2xl"></i>
                                    </div>
                                    <h3 class="font-bold text-center text-gray-800">用户参与</h3>
                                    <p class="text-center font-bold text-blue-600 text-xl">200+</p>
                                    <p class="text-xs text-center text-gray-500">内部测试用户</p>
                                </div>
                                
                                <div class="achievement-card bg-white p-3 rounded-lg shadow-sm border-t-2 border-blue-500" style="animation-delay: 1.2s;">
                                    <div class="text-blue-500 text-center mb-2">
                                        <i class="fas fa-bug text-2xl"></i>
                                    </div>
                                    <h3 class="font-bold text-center text-gray-800">问题修复</h3>
                                    <p class="text-center font-bold text-blue-600 text-xl">95%</p>
                                    <p class="text-xs text-center text-gray-500">已解决的问题</p>
                                </div>
                                
                                <div class="achievement-card bg-white p-3 rounded-lg shadow-sm border-t-2 border-blue-500" style="animation-delay: 1.4s;">
                                    <div class="text-blue-500 text-center mb-2">
                                        <i class="fas fa-tachometer-alt text-2xl"></i>
                                    </div>
                                    <h3 class="font-bold text-center text-gray-800">性能提升</h3>
                                    <p class="text-center font-bold text-blue-600 text-xl">40%</p>
                                    <p class="text-xs text-center text-gray-500">处理速度提升</p>
                                </div>
                                
                                <div class="achievement-card bg-white p-3 rounded-lg shadow-sm border-t-2 border-blue-500" style="animation-delay: 1.6s;">
                                    <div class="text-blue-500 text-center mb-2">
                                        <i class="fas fa-thumbs-up text-2xl"></i>
                                    </div>
                                    <h3 class="font-bold text-center text-gray-800">用户满意度</h3>
                                    <p class="text-center font-bold text-blue-600 text-xl">88%</p>
                                    <p class="text-xs text-center text-gray-500">内测满意度评分</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    
    <script>
        document.addEventListener('DOMContentLoaded', function() {
            // 项目完成度饼图
            const ctx = document.getElementById('completionChart').getContext('2d');
            const completionChart = new Chart(ctx, {
                type: 'doughnut',
                data: {
                    labels: ['已完成', '进行中', '未开始'],
                    datasets: [{
                        data: [60, 25, 15],
                        backgroundColor: [
                            '#0047AB',
                            '#FFC107',
                            '#E0E0E0'
                        ],
                        borderColor: [
                            '#FFFFFF',
                            '#FFFFFF',
                            '#FFFFFF'
                        ],
                        borderWidth: 2
                    }]
                },
                options: {
                    responsive: true,
                    maintainAspectRatio: false,
                    plugins: {
                        legend: {
                            position: 'bottom',
                            labels: {
                                boxWidth: 12,
                                font: {
                                    family: "'Noto Sans SC', sans-serif",
                                    size: 12
                                }
                            }
                        },
                        tooltip: {
                            callbacks: {
                                label: function(context) {
                                    return context.label + ': ' + context.raw + '%';
                                }
                            }
                        }
                    },
                    cutout: '65%',
                    animation: {
                        animateScale: true,
                        animateRotate: true
                    }
                }
            });
        });
    </script>
</body>
</html>
`

var list = [
  {
    code: code,
    thinking: md,
    type: '1',
    width:1280,
    height:720,
  },
  {
    code: code2,
    thinking: md,
    type: '1',
    width:1280,
    height:823,
  },
];

export default list;
